<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,
    maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
    <title>携程旅行-酒店预订,机票预订查询,旅游度假,商旅管理-携程无线官网</title>
    <link rel="shortcut icon" href="./img/tripLogo.png" type="image/x-icon">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/trip.css">
    <link rel="stylesheet" href="./css/swiper-bundle.min.css">

</head>

<body>
    <!-- 1.轮播图 -->
    <div class="swiper-container">
        <div class="swiper-wrapper">
            <div class="swiper-slide"><img src="./img/1.jpg" alt=""></div>
            <div class="swiper-slide"><img src="./img/2.jpg" alt=""></div>
            <div class="swiper-slide"><img src="./img/3.jpg" alt=""></div>
            <div class="swiper-slide"><img src="./img/4.jpg" alt=""></div>
            <div class="swiper-slide"><img src="./img/5.jpg" alt=""></div>
        </div>
        <!-- 分页器 -->
        <div class="swiper-pagination"></div>
    </div>

    <!-- 2.导航栏 -->
    <nav>
        <div class="nav-common">
            <div class="nav-items">
                <a href="#" class="hotel">酒&nbsp;店</a>
            </div>
            <div class="nav-items">
                <a href="#">海外酒店</a>
                <a href="#">特价酒店</a>
            </div>
            <div class="nav-items">
                <a href="#">团购</a>
                <a href="#">民宿·客栈</a>
            </div>
        </div>
        <div class="nav-common">
            <div class="nav-items">
                <a href="#" class="airplane">机&nbsp;票</a>
            </div>
            <div class="nav-items">
                <a href="#">火车票·抢票</a>
                <a href="#">汽车票·船票</a>
            </div>
            <div class="nav-items">
                <a href="#">特价机票</a>
                <a href="#">专车·租车</a>
            </div>
        </div>
        <div class="nav-common">
            <div class="nav-items">
                <a href="#" class="tourism">旅&nbsp;游</a>
            </div>
            <div class="nav-items">
                <a href="#">目的地攻略</a>
                <a href="#">邮轮旅行</a>
            </div>
            <div class="nav-items">
                <a href="#">周边游</a>
                <a href="#">定制旅行</a>
            </div>
        </div>
        <div class="nav-common">
            <div class="nav-items">
                <a href="#">景点玩乐</a>
                <a href="#">WiFi·电话卡</a>
            </div>
            <div class="nav-items">
                <a href="#">礼品卡</a>
                <a href="#">购物·信用卡</a>
            </div>
            <div class="nav-items">
                <a href="#">美食林</a>
                <a href="#">保险·签证</a>
            </div>
        </div>
    </nav>

    <!-- 3.中间banner -->
    <div class="banner">
        <a href="#"><img src="./img/pic_sale.png" alt=""></a>
    </div>

    <!-- 4.底部导航 -->
    <div class="tool-box">
        <div class="tool-cn">
            <a href="#" class="link-tel">电话预订</a>
            <a href="#" class="link-down">下载客户端</a>
            <a href="#" class="link-mc">我的携程</a>
        </div>
        <div class="tool-ver">
            <a href="#" class="enlglish">ENGLISH</a>
            <a href="#" class="computer">电脑端</a>
            <a href="#" class="wap">意见反馈</a>
        </div>
        <p> @2018携程旅行 | 沪ICP备08023580号</p>
    </div>

    <script src="./js/swiper-bundle.min.js"></script>
    <script src="./js/rem.js"></script>
    <script src="./js/trip.js"></script>
</body>

</html>